<template>
  <div class="header">
    <div
      class="pagination"
      v-if="false"
    >
      <vi-icon @click="fileNo=1" class="m-r-8" type="step-backward"/>
      <vi-icon @click="fileNo>1?fileNo--:fileNo=1" class="m-r-8" type="caret-left"/>
      <input v-model="fileNo" type="number" size="small" class="page">
      <span style="margin: 0 5px;">/</span>
      <span class="m-r-8 font-12">{{max}}</span>
      <vi-icon @click="fileNo++" class="m-r-8" type="caret-right"/>
      <vi-icon @click="fileNo=max" type="step-forward"/>
    </div>

    <div class="search" v-if="advancedFunStatus !== 2 && advancedFunStatus !== 0">
      <fileSearch />
    </div>

    <!-- export -->
    <div class="hidden">
      <form :action="exportFilesUrl" method="post">
        <input type="text" name="fileIds" :value="exportFileIds" />
        <input type="text" name="type" :value="exportType" />
        <input ref="exportFormSubmit" type="submit" value="Submit" />
      </form>
    </div>

    <div class="buttons">

      <div v-if="advancedFunStatus !== 2 && advancedFunStatus !== 0" class="screenshot-button" style="width: 125px; marginRight: 16px;">
        <div style="display: inline-block;" @click="capture">
          <img src="../../assets/image/image-scissor.png" alt="button-icon" style="padding: 0 8px 0 12px; vertical-align: sub;">
          <span>截图识别</span>
        </div>

        <vi-popover placement="bottomRight" trigger="click" :align="popoverObj" v-model="captureVisible" @visibleChange="handleVisibleChange">
          <template slot="content">
            <div class="screenshot-dropdown">
              <div class="screenshot-dropdown-item" >
                <vi-checkbox
                  :checked="screenHideWindow"
                  @change="hideWindow"
                >截图时隐藏当前窗口</vi-checkbox>
              </div>
              <div class="screenshot-dropdown-item" style="padding-left: 34px;" @click="setShortKey">设置快捷键</div>
            </div>
          </template>
          <vi-icon type="down" style="padding: 9px 10px;"></vi-icon>
        </vi-popover>
      </div>

      <upload id="file4" :uploadId="file4" v-if="status!==1"/>
      <vi-button type="primary" class="upload-list" @click="stopUploadMess" v-else>
        <img id="add-file" src="../../assets/image/add_file.png" class="color-filter" alt>
        <span>添加文件</span>
      </vi-button>

      <div v-if="advancedFunStatus !== 2 && advancedFunStatus !== 0" class="screenshot-button export-button" style="width: 132px;">
        <div style="display: inline-block;" @click="selectItem('docx')">
          <img src="../../assets/image/word2.png" alt="button-icon" class="color-filter" style="padding: 0 8px 0 12px; vertical-align: sub;">
          <span style="width: 60px;">导出word</span>
        </div>
        <vi-popover placement="bottomRight" trigger="click" v-model="exportVisible" @visibleChange="handleExportVisibleChange">
          <template slot="content">
            <div class="screenshot-dropdown export-dropdown">
              <div class="screenshot-dropdown-item export-dropdown-item" @click="selectItem('docx')">
                <img id="export-word" class="color-filter" src="../../assets/image/word2.png" alt="button-icon" style="margin-right: 10px;">
                <span>导出word</span>
              </div>
              <div class="screenshot-dropdown-item export-dropdown-item" @click="selectItem('wps')">
                <img id="export-word" class="color-filter" src="../../assets/image/word2.png" alt="button-icon" style="margin-right: 10px;">
                <span>导出wps</span>
              </div>
              <div class="screenshot-dropdown-item export-dropdown-item" @click="selectItem('pdf')">
                <img id="export-pdf" class="color-filter" src="../../assets/image/pdf2.png" alt="button-icon" style="margin-right: 10px;">
                <span>导出双层pdf</span>
              </div>
              <div class="screenshot-dropdown-item export-dropdown-item" :class="{'table-not-exit': false}" @click="selectItem('xlsx')">
                <img id="export-excel" class="color-filter" src="../../assets/image/excel2.png" alt="button-icon" style="margin-right: 10px;">
                <span>导出excel</span>
              </div>
              <div class="screenshot-dropdown-item export-dropdown-item" @click="selectItem('et')">
                <img id="export-word" class="color-filter" src="../../assets/image/excel2.png" alt="button-icon" style="margin-right: 10px;">
                <span>导出et</span>
              </div>
              <div class="screenshot-dropdown-item export-dropdown-item" @click="selectItem('txt')">
                <img id="export-txt" class="color-filter" src="../../assets/image/txt2.png" alt="button-icon" style="margin-right: 10px;">
                <span>导出txt</span>
              </div>
              <div class="screenshot-dropdown-item export-dropdown-item" @click="selectMergeItem('docx')">
                <img id="export-word" class="color-filter" src="../../assets/image/word2.png" alt="button-icon" style="margin-right: 10px;">
                <span>合并导出word</span>
              </div>
              <div class="screenshot-dropdown-item export-dropdown-item" @click="selectMergeItem('pdf')">
                <img id="export-pdf" class="color-filter" src="../../assets/image/pdf2.png" alt="button-icon" style="margin-right: 10px;">
                <span>合并导出双层pdf</span>
              </div>
              <div class="screenshot-dropdown-item export-dropdown-item" @click="selectItem('rtf')">
                <img id="export-pdf" class="color-filter" src="../../assets/image/pdf2.png" alt="button-icon" style="margin-right: 10px;">
                <span>导出rtf</span>
              </div>
              <div class="screenshot-dropdown-item export-dropdown-item" @click="selectItem('html')">
                <img id="export-pdf" class="color-filter" src="../../assets/image/pdf2.png" alt="button-icon" style="margin-right: 10px;">
                <span>导出html</span>
              </div>
            </div>
          </template>
          <vi-icon type="down" style="padding: 9px 8px;"></vi-icon>
        </vi-popover>
      </div>

      <div
        v-if="advancedFunStatus !== 0"
        @click="showAdvancedBtns"
        class="screenshot-button adv-button"
        style="width: 100px;marginLeft: 16px;"
      >
        <img src="../../assets/image/advancedFun_btn.png" class="color-filter" alt="button-icon" style="padding: 0 8px 0 0; vertical-align: sub;">
        <span>高级功能</span>
      </div>

    </div>
    <vi-modal
      title="设置快捷键"
      width="400px"
      :visible="(visible && !screenShotsStatus)"
      :destroyOnClose="true"
      :maskClosable="false"
      @ok="handleOk"
      @cancel="handleCancel"
    >
      <p class="modal-shortkey">截图快捷键：ALT +
        <vi-input style="width: 40px;" :class="{'can-not-use': !canUse}" v-model="inputChar" @keyup="checkInput" @blur="checkInput"></vi-input>
        <span v-show="canUse" style="margin-left: 30px;color: green;">正常</span>
        <span v-show="!canUse" style="margin-left: 30px;color: red;">冲突</span>
      </p>
    </vi-modal>
  </div>
</template>

<script>
import upload from "./upload";
import fileSearch from "../../components/function/fileSearch";
import activeShowMixin from "../../mixin/activeShow.mixin";
import { baseURL } from "../../libs/http.js";
import axios from 'axios';

// import { webSkAsync } from "../libs/webSocket.js";

export default {
  mixins: [activeShowMixin],
  components: { upload, fileSearch },
  data() {
    return {
      fileNo: 0,
      max: 0,
      textArray: [],
      messageNum1: 0,
      messageNum2: 0,
      messageNum3: 0,
      messageNum4: 0,
      exportFileType: 'word', // 导出文件的格式：word, pdf, excel, txt

      visible: false, // 截图弹窗
      screenHideWindow: true, // 截图时是否隐藏窗口

      inputChar: 'S', // 快捷键
      oldInputChar: '', // 老快捷键 取消用的
      canUse: true, // 快捷键是否可用，true：可用，false：不可用

      currentSrc: require('../../assets/image/word2.png'),
      wordSrc: require('../../assets/image/word2.png'),
      txtSrc: require('../../assets/image/txt2.png'),
      pdfSrc: require('../../assets/image/pdf2.png'),
      excelSrc: require('../../assets/image/excel2.png'),

      popoverObj: {
        'offset': [50, 5]
      },
      file4: '#file4',
      exportFilesUrl: '',
      exportType: '',
      exportFileIds: [],
      fileDownloadWebsPay: {fileIds: '', exportFormat: '', isCompress: '' }, // 导出参数，一样的话不能重复导出。
    };
  },
  mounted() {
    // 当前快捷键是否设置

    setTimeout(() => {
      // console.log( '快捷键', localStorage.getItem("screenKey"), localStorage.getItem("screenHideWindow"), 'InputChar：', this.screenInputChar, 'CanUse', this.screenCanUse );
      if(localStorage.getItem("screenKey") !== this.screenInputChar && localStorage.getItem("screenKey") !== '' && localStorage.getItem("screenKey") !== null ){
        let char = localStorage.getItem("screenKey").slice(0, 1).replace(/[^A-Za-z]/g,'').toUpperCase()||'S';
        localStorage.setItem("screenKey", char);
        this.inputChar = char;
        this.screenKeyChange(char);
        this.setScreenInputChar(char);
      }
      else if( localStorage.getItem("screenKey") == this.screenInputChar && this.screenInputChar !== '' ){
        this.inputChar = this.screenInputChar;
        this.canUse = this.screenCanUse;
      }
      else{
        localStorage.setItem("screenKey", "S");
        this.screenKeyChange('S');
        this.setScreenInputChar('S');
      }

    }, 2000);

    if( localStorage.getItem("screenHideWindow") == 'false' ){
      this.screenHideWindow = false;
    }
    else{
      this.screenHideWindow = true;
    }

  },
  methods: {
    getOcrResult() {
      if (!this.fileId) {
        if (this.messageNum1 < 3) {
          this.messageNum1++;
          this.$message.warn(
            "请选择文件后，再识别！",
            undefined,
            () => this.messageNum1--
          );
        }
        return;
      }
      this.setNeedGetOcrResult(true);
    },
    // 导出为word
    exportWord() {
      if (
        !this.fileItem.id ||
        this.fileItem.fileType == "doc" ||
        this.fileItem.fileType == "docx" ||
        this.fileItem.fileType == "txt" ||
        this.fileItem.fileType == "DOC" ||
        this.fileItem.fileType == "DOCX" ||
        this.fileItem.fileType == "TXT"
      ) {
        if (this.messageNum2 < 3) {
          this.messageNum2++;
          this.$message.warn(
            this.fileItem.id
              ? "该类型文件不支持导出功能！"
              : "请选择文件后再执行导出功能！",
            undefined,
            () => this.messageNum2--
          );
        }
        return;
      }
      if (
        (!this.fileItem.id && this.$store.state.status.loading) ||
        this.$store.state.status.imgResult
      ) {
        if (this.messageNum3 < 3) {
          this.messageNum3++;
          this.$message.warn(
            "该文件正在加载中，请稍后重试！",
            undefined,
            () => this.messageNum3--
          );
        }

        return;
      }
      if (
        (!this.fileItem.id && this.$store.state.status.loading) ||
        this.$store.state.status.ocrResult
      ) {
        if (this.messageNum4 < 3) {
          this.messageNum4++;
          this.$message.warn(
            "该文件正在识别中，请稍后重试！",
            undefined,
            () => this.messageNum4--
          );
        }
        return;
      }

      window.open(
        `${baseURL}${this.$url.exportWord.url}?fileId=${this.fileId}`,
        "_self"
      );
    },
    // 截图
    capture () {
      // console.log('开始截图', this.screenHideWindow);
      this.screenStart(this.screenHideWindow?1:0);
    },
    // 截图时是否隐藏当前窗口
    hideWindow (e) {
      this.screenHideWindow = e.target.checked;
      localStorage.setItem("screenHideWindow", e.target.checked);
      // this.screenStart(e.target.checked?1:0);
    },
    // 截图通信
    screenStart(value) {
      this.setScreenShotsStatus(true);

      let pay = {
          code: 1,
          cmd: "Screenshot_start",
          param: value,
        }

      this.$webSC.webSCAsync(pay).then(res =>{
        if(res)
        if(res.cmd !== 'Screenshot_start')return

        if( res.status == 200 ){
          this.setScreenImgSrc(`data:image/jpg;base64,${res.result.base64}`);
        }
        else{
          this.$message.warning(`截图功能唤醒失败！`);
        }

      });

      // webSkAsync(pay).then(res =>{
      //   if(res.cmd !== 'Screenshot_start')return

      //   if( res.status == 200 ){
      //     this.setScreenImgSrc(`data:image/jpg;base64,${res.result.base64}`);
      //   }
      //   else{
      //     this.$message.warning(`截图功能唤醒失败！`);
      //   }

      // });

    },
    // 设置快捷键
    setShortKey () {
      this.visible = true;
      this.oldInputChar = this.inputChar;
      this.setCaptureVisible(false);
    },
    handleOk () {
      let input = this.inputChar
      if(input.replace(/[^A-Za-z]/g,'') == ''){
        this.$message.warning(`请输入字母A-Z！`);
      }
      else if(this.canUse){
        this.$message.success(`Alt+${this.inputChar} 快捷键设置成功！`);
        this.visible = false;
        localStorage.setItem("screenKey", this.inputChar);
      }else{
        this.$message.warning(`Alt+${this.inputChar} 快捷键冲突！`);
      }
    },
    handleCancel () {
      this.visible = false;
      this.inputChar = this.oldInputChar;
      this.canUse = true;
      localStorage.setItem("screenKey", this.oldInputChar);
      this.screenKeyChange(this.oldInputChar);
    },
    checkInput () {
      if (this.inputChar.length > 1) {
        this.inputChar = this.inputChar.slice(0, 1)
      }

      this.inputChar = this.inputChar.replace(/[^A-Za-z]/g,'');

      if(this.inputChar == ''){
        this.$message.warning(`请输入字母A-Z！`);
        // this.inputChar = this.oldInputChar;
        // return
      }

      this.inputChar = this.inputChar.toUpperCase();
      // console.log(this.inputChar);

      if(this.inputChar!== ''){
        this.screenKeyChange(this.inputChar);
      }
    },
    // screenKey 校验
    screenKeyChange(value) {
      let pay = {
          code: 3,
          cmd: "Hot_key",
          param: `Alt+${value}`,
        }

      this.$webSC.webSCAsync(pay).then(res =>{
        // console.log( 'header screenKeyChange', pay, res);
        if(res)
        if(res.cmd !== 'Hot_key')return

        if( (res.status == 200 || res.status == 400) && !this.canUse ){
          this.canUse = true;
        }else if( res.status == 500 && this.canUse ){
          this.canUse = false;
        }

      });

      // webSkAsync(pay).then(res =>{
      //   // console.log('res', res);
      //   if(res.cmd !== 'Hot_key')return
      //   if( (res.status == 200 || res.status == 400) && !this.canUse ){
      //     this.canUse = true;
      //   }else if( res.status == 500 && this.canUse ){
      //     this.canUse = false;
      //   }
      // });

    },
    //导出rtf/html
    downloadFile(url) {
      const fileName = parseInt(new Date().getTime())
      const link = document.createElement('a')
      link.style.display = 'none'
      link.href = url
      link.setAttribute('download', fileName)
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link)
    },
    // 选择导出的格式
    selectItem (type) {
      // if (!this.fileId){
      //   this.$message.warning("请打开需要导出的文件！");
      //   return
      // }
      if (this.allSelectedFileList.length === 0){
        this.$message.warning("请勾选需要导出的文件！");
        return
      }
      if (this.allSelectedFileList.length > 500){
        this.$message.warning("导出文件总页数最大支持500页！");
        return
      }
      if (!this.canMergeExport) {
        this.$message.warning("不支持跨文件夹导出！");
        return
      }
      // if (type === 'xlsx' && !this.tableExit) {
      //   return
      // }
      if ((type === 'xlsx' || type === 'et') && (this.allSelectedFileList.length > 1 || this.isMultiPdf(this.allSelectedFileList[0]))) {
        this.$message.warning("Excel仅支持单页文件导出！");
        return
      }

      this.exportFileType = (type === 'txt' || type === 'pdf' )?type:(
        (type === 'xlsx')?'excel':'word'
      );

      this.currentSrc = ('docx' === type || 'wps' === type)?this.wordSrc:(
        ('pdf' === type)?this.pdfSrc:(
          ('xlsx' === type || 'et' === type )?this.excelSrc:(
            ('txt' === type)?this.txtSrc:this.wordSrc
          )
        )
      );

      this.exportFileApi(type);
    },
    exportFileApi (type){
      //let url = `${baseURL.substr(0, baseURL.length-1 )}${this.$url.getExportFile.url}/${(this.$store.state.activeFile.pdfChildInfo.list.length?this.$store.state.activeFile.pdfChildInfo.list[this.$store.state.activeFile.pdfChildInfo.index].id:id)}?type=${type}`;
      let fileIds = [];
      this.fileList.forEach(item => {
        if (this.allSelectedFileList.indexOf(item.id) !== -1) {
          fileIds.push(item.id);
        }
      })

      if(fileIds.length == 1){
        this.$message.loading(`导出校验中...`);
        let url
        let method
        if(type === 'rtf' || type === 'html'){
          url = `${baseURL.substr(0, baseURL.length-1 )}${this.$url.exportRtfOrHtml.url}/${fileIds}?type=${type}`;
          this.downloadFile(url)
          return
        }else{
          method = 'post'
          url = `${baseURL.substr(0, baseURL.length-1 )}${this.$url.getExportFile.url}/${fileIds}?type=${type}`;
        }
        axios({
            method: method,
            url: url,
            withCredentials: true,
            data: {"id": `${fileIds}`, "type": type},
        })
        .then(result => {
          // ccc导出次数预留处理位置
          if(result.data.body){
            // 唤醒客户端 导出
            this.fileDownloadWebs(fileIds, type, false);

            // this.$message.loading(`正在导出..`);
            // window.open(url, "_self");
          }
          else{

            if(!result.data.body){
              this.$message.warning(`${result.data.state.failed!==''?result.data.state.failed:"文件无法导出！"}`);
            }
            else{
              this.$message.warning("文件无法导出！");
            }

          }
        })
        .catch( error => {
          // console.log(error);
          this.$message.warning("导出失败，请重试！");
        });
      }
      else{
        this.exportFilesUrl = `${baseURL.substr(0, baseURL.length-1 )}${this.$url.getExportBatchFile.url}`;
        this.exportType = type;
        this.exportFileIds = fileIds;
        // this.setLoadingLabel(`批量导出校验中...`);
        this.$message.loading(`批量导出校验中...`);

        // axios({
        //     method: 'post',
        //     url: this.exportFilesUrl,
        //     withCredentials: true,
        //     data: {"fileIds": `${fileIds}`, "type": type},
        // })

        let opt = _.cloneDeep(this.$url.checkExportBatchFile);
        opt.url = `${this.$url.checkExportBatchFile.url}`;
        this.$http(opt, {"fileIds": fileIds, "type": type}, false)
        .then(result => {
          // this.setLoadingLabel(``);

          if(result.body){
            // 唤醒客户端 导出
            this.fileDownloadWebs(fileIds, type, true);

            // this.$message.loading(`正在导出..`);
            // this.$refs.exportFormSubmit.click();
          }
          else{

            if(!result.body){
              this.$message.warning(`${result.state.failed!==''?result.state.failed:"文件无法合并导出！"}`);
            }
            else{
              this.$message.warning("文件无法批量导出！");
            }

          }
        })
        .catch( error => {
          // console.log(error);
          this.$message.warning("导出失败，请重试！");
        });
      }

    },
    // 合并导出
    selectMergeItem (type) {
      if (this.allSelectedFileList.length === 0){
        this.$message.warning("请勾选需要合并导出的文件！");
        return
      }
      if (this.allSelectedFileList.length > 500){
        this.$message.warning("合并导出最大支持500个文件！");
        return
      }
      if (!this.canMergeExport) {
        this.$message.warning("不支持跨文件夹导出！");
        return
      }

      let fileIds = [];
      let status0 = false; // 是否有pdf格式文件导出
      let status1 = []; // 是否有不同类型的文件
      this.fileList.forEach(item => {
        if (this.allSelectedFileList.indexOf(item.id) !== -1) {
          fileIds.push(item.id);
          status0 = (item.fileType.toLowerCase() === 'pdf')

          if(_.indexOf(status1, item.fileType.toLowerCase() ) == -1 ){
            status1.push( item.fileType.toLowerCase() );
          }
          //

        }
      })
      //
      // console.log( 'selectMergeItem', this.fileList );
      if( status0 ){
        this.$message.warning("合并导出不支持PDF文件！");
        return
      }

      if(status1.length > 1){
        this.$message.warning("合并导出仅支持同类型文件！");
        return
      }

      // let postUrl = `${baseURL.substr(0, baseURL.length-1 )}${this.$url.mergeExport.url}?fileIds=${fileIds}`;
      this.exportFilesUrl = `${baseURL.substr(0, baseURL.length-1 )}${this.$url.mergeExport.url}`;
      this.exportType = type;
      this.exportFileIds = fileIds;
      // this.setLoadingLabel(`合并导出校验中...`);
      this.$message.loading(`合并导出校验中...`);

      // axios({
      //     method: 'post',
      //     url: this.exportFilesUrl,
      //     withCredentials: true,
      //     data: {"fileIds": `${fileIds}`, "type": type},
      // })

      let opt = _.cloneDeep(this.$url.checkMergeExport);
        opt.url = `${this.$url.checkMergeExport.url}`;
      this.$http(opt, {"fileIds": fileIds, "type": type}, false)
      .then(result => {
        // this.setLoadingLabel(``);

        if(result.body){
          // 唤醒客户端 导出
          this.fileDownloadWebs(fileIds, type, false);

          // this.$message.loading(`正在导出..`);
          // this.$refs.exportFormSubmit.click();
        }
        else{

          if(!result.body){
            this.$message.warning(`${result.state.failed!==''?result.state.failed:"文件无法合并导出！"}`);
          }
          else{
            this.$message.warning("文件无法合并导出！");
          }

        }
        //

      })
      .catch( error => {
          // console.log(error);
          this.$message.warning("合并导出失败，请重试！");
      });
    },
    // 导出新方法，和客户端通信
    fileDownloadWebs (fileIds, type, isCompress){
      // let exportFormat = (type === 'txt' || type === 'pdf' )?type:(
      //   (type === 'xlsx')?'excel':'word'
      // );

      let pay = {
          code: 7,
          cmd: "File_download",
          param: {
            fileIds: `${fileIds}`, exportFormat: type, isCompress, userId: this.userId,
          },
        };

      // if(this.fileDownloadWebsPay.fileIds === pay.param.fileIds && this.fileDownloadWebsPay.exportFormat === pay.param.exportFormat && this.fileDownloadWebsPay.isCompress === pay.param.isCompress ){
      //   this.$message.warning("文件已准备导出！");
      //   return
      // }
      // else{
      //   let objFileDownloadWebsPay = {fileIds: `${fileIds}`, exportFormat: type, isCompress };
      //   this.fileDownloadWebsPay = objFileDownloadWebsPay;
      // }

      // 开启导出动画
      let objAnimation = _.cloneDeep(this.fileDownloadAnimation);
      objAnimation[objAnimation.length-1].status = true;
      objAnimation.push({ status: false, startTop: objAnimation[objAnimation.length-1].startTop, startLeft: objAnimation[objAnimation.length-1].startLeft, });
      this.setFileDownloadAnimation(objAnimation);

      this.$webSC.webSCAsync(pay).then(res =>{
        // console.log( 'fileDownloadWebs', pay, res);
        if(res)
        if(res.cmd !== 'File_download'){return}

        if( res.status == 200 ){
          if(res.result.id == undefined || res.result.taskId == undefined || res.result.fileName == undefined ){
            return
          }

          let array = _.cloneDeep(this.fileDownloadList);
          let obj = {
            ...res.result,
            fileIds: `${fileIds}`,
            exportFormat: type,
            isCompress,
            status: 0,
            progress: 0,
            memory: 0,
            currentMemory: 0,
          };
          array.push(obj);
          this.setFileDownloadList(array);
        }

      });

    },
    // 导出文件
    // 191022 未发现该方法的调用交互
    exportFile () {
      if (!this.fileId){
        this.$message.warning("请打开需要导出的文件！");
        return
      }

      let type = (this.exportFileType === 'txt' || this.exportFileType === 'pdf' )?this.exportFileType:(
        (this.exportFileType === 'excel')?'xlsx':'docx'
      );

      this.exportFileApi( type , this.fileId);
    },
    handleVisibleChange () {
      if (this.captureVisible) {
        this.setCaptureVisible(false)
      } else {
        this.setCaptureVisible(true)
      }
    },
    handleExportVisibleChange () {
      if (this.exportVisible) {
        this.setExportVisible(false)
      } else {
        this.setExportVisible(true)
      }
    },
    // 判断是否是多页pdf文件
    isMultiPdf (id) {
      let selectList = this.fileList.filter(item => id === item.id)
      if (selectList.length === 1) {
        return selectList[0].filePage > 1
      } else {
        return false
      }
    },
    // 获取 示例文件夹的文件id
    getExampleFolderId() {
      for (let i = 0; i < this.folderList.length; i++) {
        if (this.folderList[i].dirType === 1) {
          return {id: this.folderList[i].id, index: i};
        }
      }
    },
    showAdvancedBtns() {
      this.setScreenKeyStatus(0); // 修改状态
      if (this.advancedFunStatus === 1) {
        this.setAdvancedFunStatus(2)
      } else if (this.advancedFunStatus === 2) {
        this.setAdvancedFunStatus(1)
        if (this.dirId === this.getExampleFolderId().id) {
          this.setFileID(null)
        }
      }
    },
    stopUploadMess(){
      this.$message.warning('文件正在识别中，请稍后操作！')
    },
  },
  watch: {
    fileList: {
      handler(newVal) {
        this.max = newVal.length;
      },
      deep: true
    },
    fileIndex(newVal) {
      this.fileNo = newVal + 1;
    },
    fileNo(newValue) {
      let fileNo = Number(newValue);
      if (fileNo < 1) {
        this.fileNo = 0;
      } else if (fileNo > this.max) {
        this.fileNo = this.max;
      } else {
        this.fileNo = Number(fileNo.toFixed(0));
      }
      if (typeof newValue == "number") {
        this.$nextTick(() => {
          if (this.fileNo > 0) {
            this.setActiveFile(this.fileNo - 1);
          }
        });
      }
    },
    resultTextArray: {
      handler(newValue) {
        this.textArray = newValue || [];
      },
      deep: true
    },
    screenKeyStatus(newValue) {
      if(newValue === 1 && this.advancedFunStatus !== 2 ){
        // 触发快捷键截图
        // console.log('快捷键截图！');
        this.setScreenKeyStatus(0); // 修改状态
        this.setSelectionBtnVisible(false);
        this.setCaptureVisible(false);
        this.setExportVisible(false);

        this.screenStart(this.screenHideWindow?1:0); // 截图
      }
    },
    inputChar(newValue) {
      if(newValue === ''){
        this.$message.warning(`请输入字母A-Z！`);
      }else{
        // this.checkInput();
      }
    },
  },
  computed: {
    status(){
      return this.$store.state.file.status;
    },
    fileId() {
      let item = this.$store.state.activeFile.item;
      return item ? item.id : null;
    },
    userId() {
      return this.$store.state.user.userId;
    },
    dirId() {
      return this.$store.state.user.dirId;
    },
    resultTextArray() {
      return this.$store.state.cache.resultTextArray;
    },
    fileList() {
      return this.$store.state.file.fileList;
    },
    fileIndex() {
      return this.$store.state.activeFile.fileIndex;
    },
    pdfItem() {
      return this.$store.state.activeFile.pdfItem;
    },
    fileItem() {
      return this.$store.state.activeFile.item;
    },
    screenShotsStatus() {
      return this.$store.state.status.screenShotsStatus;
    },
    screenKeyStatus() {
      return this.$store.state.status.screenKeyStatus;
    },
    screenInputChar() {
      this.inputChar = this.$store.state.status.screenInputChar==''?'S':this.$store.state.status.screenInputChar;
      return this.$store.state.status.screenInputChar;
    },
    screenCanUse() {
      this.canUse = this.$store.state.status.screenCanUse;
      return this.$store.state.status.screenCanUse;
    },
    tableExit() {
      return this.$store.state.status.tableExit;
    },
    captureVisible: {
      get() {
        return this.$store.state.status.captureVisible;
      },
      set() {} // 不设置时控制台会报错
    },
    exportVisible: {
      get() {
        return this.$store.state.status.exportVisible;
      },
      set() {}
    },
    allSelectedFileList() {
      return this.$store.state.file.allSelectedFileList;
    },
    allSelectedFolderList() {
      return this.$store.state.file.allSelectedFolderList;
    },
    canMergeExport() {
      if (this.allSelectedFolderList.length > 1) {
        return false;
      }
      if (this.allSelectedFolderList.length === 0 && this.allSelectedFileList.length) {
        return true;
      }
      let flag = true;
      this.allSelectedFileList.forEach(item => {
        this.fileList.forEach(item1 => {
          if (item === item1.id) {
            if (item1.dirId !== this.allSelectedFolderList[0]) {
              flag = false;
            }
          }
        })
      })
      return flag;
    },
    advancedFunStatus() {
      return this.$store.state.status.advancedFunStatus;
    },
    folderList() {
      return this.$store.state.file.folderList;
    },
    fileDownloadList(){
      return this.$store.state.status.fileDownloadList;
    },
    fileDownloadAnimation(){
      return this.$store.state.status.fileDownloadAnimation;
    },
  }
};
</script>

<style lang="less" scoped>
i:before {
  cursor: pointer;
}

.align-center {
  display: flex;
  padding: 0 5px 0 15px;
  align-items: center;

  img[alt="button-icon"] {
    margin-right: 8px;
  }
}

.dashed-button {
  border: 1px solid #3759b3;
  background: transparent;
  margin-left: 16px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0;
}

.buttons {
  display: flex;
  align-items: center;
  .screenshot-button {
    height: 32px;
    line-height: 32px;
    border-radius: 3px;
    background-color: @primary;
    color: #fff;
    cursor: pointer;
  }
  .export-button {
    box-sizing: border-box;
    border: 1px solid @primary;
    margin: 0 0 0 16px;
    background-color: transparent;
    color: @primary;
  }

  .adv-button{
    border: 1px solid @primary;
    background-color: transparent;
    color: @primary;
    text-align: center;
  }

  & > div {
    align-items: center;
    height: 100%;
  }
}

.screenshot-dropdown {
  width: 175px;
  border-radius: 2px;
  text-align: left;
  background-color: #fff;
  box-shadow: 0 0 5px #ccc;
  color: rgba(0, 0, 0, 0.65);
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
  .screenshot-dropdown-item {
    height: 40px;
    line-height: 40px;
    padding: 0 5px 0 10px;
    border-radius: 2px;
    cursor: pointer;
    &:hover {
      background-color: @primary;
      color: #fff;
    }
    &:hover .ant-checkbox-wrapper {
      color: #fff;
    }
    &:hover #export-word {
      content: url('../../assets/image/word1.png')
    }
    &:hover #export-pdf {
      content: url('../../assets/image/pdf1.png')
    }
    &:hover #export-excel {
      content: url('../../assets/image/excel1.png')
    }
    &:hover #export-txt {
      content: url('../../assets/image/txt1.png')
    }
  }
  .table-not-exit {
    cursor: not-allowed;
    #export-excel {
      content: url('../../assets/image/excel_disabled.png')
    }
    span {
      color: #ccc;
    }
    &:hover {
      background-color: #fff;
      color: #ccc;
      #export-excel {
        content: url('../../assets/image/excel_disabled.png')
      }
    }
  }
}

.export-dropdown {
  // width: 130px;
  width: 160px;
  .export-dropdown-item {
    padding: 0 5px 0 15px;
    color: @primary;
  }
}

.m-b-15 {
  margin-bottom: 15px;
}

.header {
  position: relative;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-grow: 0;
  flex-shrink: 0;
}

.pagination {
  display: flex;
  align-items: center;
  font-size: 16px;

  .m-r-8 {
    margin-right: 8px;
  }

  .icon {
    margin-right: 8px;
  }

  .page {
    width: 2rem;
    outline: none;
    font-size: 12px;
    border: 1px solid #aaa;
    text-align: center;
    background: transparent;
  }
}
.modal-shortkey {
  text-align: center;
}
.can-not-use {
  border-color: red;
}
.hidden{
  width: 0;
  height: 0;
  overflow: hidden;
}
</style>
